<%--
  Created by IntelliJ IDEA.
  User: Eternity
  Date: 2020/9/9
  Time: 19:50
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script src="https://cdn.bootcss.com/sweetalert/1.1.3/sweetalert.min.js"></script>
    <meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />

    <script>

        function del(a) {
            $.ajax({
                url:"/user/deleteUser",
                contentType:"application/json;charset=UTF-8",
                data:'{"id":'+a+'}',
                dataType:"json",
                type:"post",
                success:function (data) {
                    alert(data.username)
                    alert(data.id)
                    alert(data.password)
                    alert(data.type)
                }
            })
        }

        function subBtn() {
            //获取表单信息
            var names = $("#names").val()
            var username = $("[name=username]").val()
            var password = $("[name=password]").val()
            var type = $("[name=type1]").val()

            if (names == null || names==""){
                alert("姓名不能为空！")
                alert(names)
                return false;
            }
            if (username == null || username == ""){
                alert("账号不能为空！")
                return false;
            }
            if (password == null || password == ""){
                alert("密码不能为空！")
                return false;
            }
            if (type == -1){
                alert("请选择类型！")
                return false;
            }
            $.ajax({
                //请求路径
                url : "/user/addUsers",
                //请求参数
                data:{
                    names : names,
                    username : username,
                    password : password,
                    type : type
                },
                type:"post",
                dataType:"json",
                success:function (data) {
                    if (data==200){
                        window.location.href="/user/getAll";
                    } else {
                        alert("账号已存在！")
                    }
                    // if(data.status==200){
                    //     swal({
                    //         title:"信息提示",
                    //         text:"入库成功",
                    //         type:"success",
                    //         confirmButtonText:'确定'
                    //     },function(){
                    //         window.location.reload();
                    //     })
                    // }else {
                    //     swal({
                    //         title:'信息提示',
                    //         text:data.msg,
                    //         type:'error',
                    //         confirmButtonText:'确认'
                    //     });
                    // }
                },error:function () {
                    alert("系统异常！")
                }
            })
        }

        function importData() {
            $("[name=img]").click()
        }


        function submitFile() {
            var img = document.myForm.img.files[0];
            if(!img){
                alert("请选择文件")
                return;
            }
            //account.xls account.xlsx
            var fileName=img.name;
            //截取后缀
            var fileType = (fileName.substring(fileName.lastIndexOf(".") + 1, fileName.length)).toLowerCase();
            //根据后缀判断文件类型
            if (fileType !== 'xls' && fileType !== 'xlsx') {
                alert('文件格式不正确，请上传excel文件！');
                return false;
            }
            var fm = new FormData();
            fm.append('fileName', img);
            fm.append('suffixName',fileType)


            $.ajax({
                url: '/user/readExcel',
                type: 'POST',
                data: fm,
                contentType: false, //禁止设置请求类型
                processData: false, //禁止jquery对DAta数据的处理,默认会处理
                //禁止的原因是,FormData已经帮我们做了处理
                success: function (result) {
                    alert(result.msg)
                    window.location.href = "/user/fildAllAccount";
                    //测试是否成功
                    //但需要你后端有返回值
                    console.info(result)
                }
            });
        }

        //批量删除
        function deleteButton() {
            //判断至少写了一项
            var checkedNum=$("input[name='subcheck']:checked").length;
            if(checkedNum==0){
                alert("请至少选择一项！！");
                return false;
            }
            if(confirm("确定删除所选项目？")){
                var checkedList=new Array();
                $("input[name='subcheck']:checked").each(function () {
                    checkedList.push($(this).val());
                });
                $.ajax({
                    type :"POST",
                    url : "/user/delete",
                    data : {"user":checkedList.toString()},
                    dataType : "html",
                    success : function (data) {
                        $("[name='checkbox']:checkbox").attr("checked",false);
                        location.reload();//页面刷新
                    },
                    error:function (data) {
                        art.dialog.tips("删除失败！");
                    }
                })
            }
        }
        //全选
        function selectAll() {
            if($("#SelectAll").is(":checked")){
                $(":checkbox").prop("checked",true);//所有选择框都选中
            }else {
                $(":checkbox").prop("checked",false);
            }
        }

    </script>
</head>
<body>
<%--头部信息--%>
<jsp:include page="hade.jsp"/>
<div class="container">

    <%--账号的类型accounnt.type--%>
    <input type="hidden" value="${user.type}" id="type">
    <h2>欢迎${user.names}登录后台管理系统</h2>
    <p>勾正商品管理系统--->用户信息管理</p>
    <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">添加</button>
    <a href="/user/userInfo"><button type="button" class="btn btn-primary">个人信息</button></a>
    <a href="/user/downloadExcel"><button type="button" class="btn btn-info">导出</button></a>
    <a href="/user/xiazai"><button type="button" class="btn btn-info">下载导入模板</button></a>
    <button type="button" class="btn btn-info" onclick="importData()">导入</button>

    <form name="myForm"  enctype="multipart/form-data">
        <input type="file" style="display: none" onchange="submitFile()" name="img">
    </form>
        <button type="button" class="btn btn-danger" onclick="deleteButton()">批量删除</button>
    <form action="/user/getAll" method="post">
        <div class="row">

            <div class="col-lg-7">
            </div>

            <div class="col-lg-3">
                <input type="text" class="form-control" name="names" id="selName" style="width: 270px" placeholder="请输入要查询的姓名" >
            </div>
            <div class="col-lg-2">
                <button type="submit" class="btn btn-primary">查询</button>
            </div>

        </div>
    </form>
    <table class="table table-hover">
        <thead>
        <tr>
            <th align="center"><input type="checkbox" id="SelectAll" onclick="selectAll();"></th>
            <th>姓名</th>
            <th>账号</th>
            <th>类型</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${list}" var="user">
            <tr>
                <td width="3%" height="26" align="center">
                    <input type="checkbox" value="${user.id}" name="subcheck"/>
                </td>
                <td>${user.names}</td>
                <td>${user.username}</td>
                <td><span class="badge badge-success">${user.type eq 0?"超级管理员":"普通管理员"}</span></td>
                <td>
                    <a href="/user/toUpdate?id=${user.id}"><button type="button" class="btn btn-primary">编辑</button></a>
                    <a href="/user/deleteUser/${user.id}"><button type="button" class="btn btn-danger">删除</button></a>
                        <%--<button type="button" class="btn btn-danger" onclick="del(${account.id})">删除</button>--%>
                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>
</div>
</table>
</div>

<br>
<!-- 添加模态框 -->
<div class="modal fade" id="myModal">
    <div class="modal-dialog">
        <div class="modal-content">

            <!-- 模态框头部 -->
            <div class="modal-header">
                <h4 class="modal-title">添加用户信息</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            <%--<form action="${pageContext.request.contextPath}/account/addAccount" method="post">--%>
            <!-- 模态框主体 -->
            <div class="modal-body">

                <div class="form-group">
                    <label for="names">姓名:</label>
                    <input type="text" class="form-control" id="names" name="names" placeholder="请输入用户名">
                </div>
                <div class="form-group">
                    <label for="username">账号:</label>
                    <input type="text" class="form-control" id="username" name="username" placeholder="请输入账号">
                </div>
                <div class="form-group">
                    <label for="password">密码:</label>
                    <input type="password" class="form-control" id="password" name="password">
                </div>
                <div class="form-group">
                    <label for="sel1">账号类型:</label>
                    <select class="form-control" id="sel1" name="type1">
                        <option value="-1" selected>请选择</option>
                        <option value="0">超级管理员</option>
                        <option value="1">教师管理员</option>
                    </select>
                </div>
            </div>
            <!-- 模态框底部 -->
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="subBtn()">保存</button>
                <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
            </div>
            <%--</form>--%>

        </div>
    </div>
</div>
</div>

</body>
</html>
